﻿<!DOCTYPE html>
<html>
  <head>
    <title>Switch 开关</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/switch___/styles.css" type="text/css" rel="stylesheet"/>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/axure/axQuery.js"></script>
    <script src="resources/scripts/axure/globals.js"></script>
    <script src="resources/scripts/axutils.js"></script>
    <script src="resources/scripts/axure/annotation.js"></script>
    <script src="resources/scripts/axure/axQuery.std.js"></script>
    <script src="resources/scripts/axure/doc.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/messagecenter.js"></script>
    <script src="resources/scripts/axure/events.js"></script>
    <script src="resources/scripts/axure/recording.js"></script>
    <script src="resources/scripts/axure/action.js"></script>
    <script src="resources/scripts/axure/expr.js"></script>
    <script src="resources/scripts/axure/geometry.js"></script>
    <script src="resources/scripts/axure/flyout.js"></script>
    <script src="resources/scripts/axure/ie.js"></script>
    <script src="resources/scripts/axure/model.js"></script>
    <script src="resources/scripts/axure/repeater.js"></script>
    <script src="resources/scripts/axure/sto.js"></script>
    <script src="resources/scripts/axure/utils.temp.js"></script>
    <script src="resources/scripts/axure/variables.js"></script>
    <script src="resources/scripts/axure/drag.js"></script>
    <script src="resources/scripts/axure/move.js"></script>
    <script src="resources/scripts/axure/visibility.js"></script>
    <script src="resources/scripts/axure/style.js"></script>
    <script src="resources/scripts/axure/adaptive.js"></script>
    <script src="resources/scripts/axure/tree.js"></script>
    <script src="resources/scripts/axure/init.temp.js"></script>
    <script src="files/switch___/data.js"></script>
    <script src="resources/scripts/axure/legacy.js"></script>
    <script src="resources/scripts/axure/viewer.js"></script>
    <script src="resources/scripts/axure/math.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u4628" class="ax_default">
        <div id="u4628_state0" class="panel_state" data-label="关">
          <div id="u4628_state0_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4629" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4630" class="ax_default box_2">
                <img id="u4630_img" class="img " src="images/switch___/u4630.png"/>
                <!-- Unnamed () -->
                <div id="u4631" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4632" class="ax_default ellipse">
                <img id="u4632_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4633" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div id="u4628_state1" class="panel_state" data-label="开" style="display: none; visibility: hidden;">
          <div id="u4628_state1_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4634" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4635" class="ax_default box_2">
                <img id="u4635_img" class="img " src="images/switch___/u4635.png"/>
                <!-- Unnamed () -->
                <div id="u4636" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4637" class="ax_default ellipse">
                <img id="u4637_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4638" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u4639" class="ax_default">
        <div id="u4639_state0" class="panel_state" data-label="开">
          <div id="u4639_state0_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4640" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4641" class="ax_default box_2">
                <img id="u4641_img" class="img " src="images/switch___/u4635.png"/>
                <!-- Unnamed () -->
                <div id="u4642" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4643" class="ax_default ellipse">
                <img id="u4643_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4644" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div id="u4639_state1" class="panel_state" data-label="关" style="display: none; visibility: hidden;">
          <div id="u4639_state1_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4645" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4646" class="ax_default box_2">
                <img id="u4646_img" class="img " src="images/switch___/u4630.png"/>
                <!-- Unnamed () -->
                <div id="u4647" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4648" class="ax_default ellipse">
                <img id="u4648_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4649" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4650" class="ax_default label" selectiongroup="开关1">
        <img id="u4650_img" class="img " src="images/typography___/u378.png"/>
        <!-- Unnamed () -->
        <div id="u4651" class="text" style="visibility: visible;">
          <p><span>按年付费</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4652" class="ax_default label selected" selectiongroup="开关1">
        <img id="u4652_img" class="img " src="images/typography___/u378.png"/>
        <!-- Unnamed () -->
        <div id="u4653" class="text" style="visibility: visible;">
          <p><span>按月付费</span></p>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u4654" class="ax_default">
        <div id="u4654_state0" class="panel_state" data-label="开">
          <div id="u4654_state0_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4655" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4656" class="ax_default box_2">
                <img id="u4656_img" class="img " src="images/switch___/u4656.png"/>
                <!-- Unnamed () -->
                <div id="u4657" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4658" class="ax_default ellipse">
                <img id="u4658_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4659" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div id="u4654_state1" class="panel_state" data-label="关" style="display: none; visibility: hidden;">
          <div id="u4654_state1_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4660" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4661" class="ax_default box_2">
                <img id="u4661_img" class="img " src="images/switch___/u4661.png"/>
                <!-- Unnamed () -->
                <div id="u4662" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4663" class="ax_default ellipse">
                <img id="u4663_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4664" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4665" class="ax_default label" selectiongroup="开关2">
        <img id="u4665_img" class="img " src="images/typography___/u378.png"/>
        <!-- Unnamed () -->
        <div id="u4666" class="text" style="visibility: visible;">
          <p><span>按年付费</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4667" class="ax_default label selected" selectiongroup="开关2">
        <img id="u4667_img" class="img " src="images/typography___/u378.png"/>
        <!-- Unnamed () -->
        <div id="u4668" class="text" style="visibility: visible;">
          <p><span>按月付费</span></p>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u4669" class="ax_default">
        <div id="u4669_state0" class="panel_state" data-label="开">
          <div id="u4669_state0_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4670" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4671" class="ax_default box_2">
                <img id="u4671_img" class="img " src="images/switch___/u4635.png"/>
                <!-- Unnamed () -->
                <div id="u4672" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4673" class="ax_default ellipse">
                <img id="u4673_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4674" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div id="u4669_state1" class="panel_state" data-label="关" style="display: none; visibility: hidden;">
          <div id="u4669_state1_content" class="panel_state_content">

            <!-- Unnamed (Group) -->
            <div id="u4675" class="ax_default">

              <!-- Unnamed (Rectangle) -->
              <div id="u4676" class="ax_default box_2">
                <img id="u4676_img" class="img " src="images/switch___/u4630.png"/>
                <!-- Unnamed () -->
                <div id="u4677" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Ellipse) -->
              <div id="u4678" class="ax_default ellipse">
                <img id="u4678_img" class="img " src="images/switch___/u4632.png"/>
                <!-- Unnamed () -->
                <div id="u4679" class="text" style="display: none; visibility: hidden">
                  <p><span></span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 弹出框 (Speech Bubble) -->
      <div id="u4680" class="ax_default box_2 ax_default_hidden" data-label="弹出框" style="display: none; visibility: hidden">
        <img id="u4680_img" class="img " src="images/switch___/弹出框_u4680.png"/>
        <!-- Unnamed () -->
        <div id="u4681" class="text" style="visibility: visible;">
          <p><span>启用XX</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u4682" class="ax_default">

        <!-- Unnamed (Rectangle) -->
        <div id="u4683" class="ax_default box_2 disabled">
          <img id="u4683_img" class="img " src="images/switch___/u4683.png"/>
          <!-- Unnamed () -->
          <div id="u4684" class="text" style="display: none; visibility: hidden">
            <p><span></span></p>
          </div>
        </div>

        <!-- Unnamed (Ellipse) -->
        <div id="u4685" class="ax_default ellipse disabled">
          <img id="u4685_img" class="img " src="images/switch___/u4632.png"/>
          <!-- Unnamed () -->
          <div id="u4686" class="text" style="display: none; visibility: hidden">
            <p><span></span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u4687" class="ax_default">

        <!-- Unnamed (Rectangle) -->
        <div id="u4688" class="ax_default box_2 disabled">
          <img id="u4688_img" class="img " src="images/switch___/u4688.png"/>
          <!-- Unnamed () -->
          <div id="u4689" class="text" style="display: none; visibility: hidden">
            <p><span></span></p>
          </div>
        </div>

        <!-- Unnamed (Ellipse) -->
        <div id="u4690" class="ax_default ellipse disabled">
          <img id="u4690_img" class="img " src="images/switch___/u4632.png"/>
          <!-- Unnamed () -->
          <div id="u4691" class="text" style="display: none; visibility: hidden">
            <p><span></span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4692" class="ax_default label">
        <img id="u4692_img" class="img " src="images/switch___/u4692.png"/>
        <!-- Unnamed () -->
        <div id="u4693" class="text" style="visibility: visible;">
          <p><span>Switch 开关</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4694" class="ax_default label">
        <img id="u4694_img" class="img " src="images/switch___/u4694.png"/>
        <!-- Unnamed () -->
        <div id="u4695" class="text" style="visibility: visible;">
          <p><span>表示两种相互对立的状态间的切换，多用于触发「开/关」。</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4696" class="ax_default label">
        <img id="u4696_img" class="img " src="images/icon_图标/u486.png"/>
        <!-- Unnamed () -->
        <div id="u4697" class="text" style="visibility: visible;">
          <p><span>基础用法</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4698" class="ax_default label">
        <img id="u4698_img" class="img " src="images/icon_图标/u486.png"/>
        <!-- Unnamed () -->
        <div id="u4699" class="text" style="visibility: visible;">
          <p><span>文字描述</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4700" class="ax_default label">
        <img id="u4700_img" class="img " src="images/switch___/u4700.png"/>
        <!-- Unnamed () -->
        <div id="u4701" class="text" style="visibility: visible;">
          <p><span>扩展的 value 类型</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4702" class="ax_default label">
        <img id="u4702_img" class="img " src="images/icon_图标/u486.png"/>
        <!-- Unnamed () -->
        <div id="u4703" class="text" style="visibility: visible;">
          <p><span>禁用状态</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4704" class="ax_default box_2">
        <img id="u4704_img" class="img " src="images/color___/u352.png"/>
        <!-- Unnamed () -->
        <div id="u4705" class="text" style="display: none; visibility: hidden">
          <p><span></span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4706" class="ax_default box_2">
        <img id="u4706_img" class="img " src="images/color___/u352.png"/>
        <!-- Unnamed () -->
        <div id="u4707" class="text" style="display: none; visibility: hidden">
          <p><span></span></p>
        </div>
      </div>
    </div>
  </body>
</html>
